﻿@model HotelRegistrationSystem.Models.RoomReservationModel

@Styles.Render("~/Content/themes/start/css")

<h2>Confirm reservation</h2>
<div class="row">

    <div class="six columns">
        @{        
            var pic = ViewBag.Picture;
            string picturePath = pic != null ?
            string.Format("/Pictures_Hotels/{0}", pic.PictureName) :
                "~/Content/images/prod_large.jpg";
        }
        <img src="@picturePath"
             onerror="this.src = '/Content/images/prod_large.jpg'"/>
    </div>

    <div class="six columns">
        <div class="panel">
        
            @if (!string.IsNullOrEmpty(ViewBag.Message))
            {
                <p class="italicText" id="errorMessage">
                    @ViewBag.Message
                </p>
                <br/><br/>
            }

            @using (Html.BeginForm("ConfirmReservation", "Hotel"))
            {
                <p class="italicText">
                    @Html.DisplayNameFor(modelItem => modelItem.HotelName)
                    @Html.DisplayFor(modelItem => modelItem.HotelName)
                </p>

                <p class="italicText">
                    <input type="hidden" id="startdate" value="@Model.StartDate"/>
                    Start Date: @Html.DisplayFor((modelItem => modelItem.StartDate))
                    <input type="hidden" id="enddate" value="@Model.EndDate"/>
                    &nbsp;&nbsp;&nbsp;End Date: @Html.DisplayFor((modelItem => modelItem.EndDate))
                </p>

                <br/><br/>

                <table>

                    <tr>
                        <td>@Html.DisplayNameFor(modelItem => modelItem.Rooms.First().RoomName)</td>
                        <td>@Html.DisplayNameFor(modelItem => modelItem.Rooms.First().SelectedBedCount)</td>
                        <td>@Html.DisplayNameFor(modelItem => modelItem.Rooms.First().Price)</td>
                    </tr> 
                
                @Html.HiddenFor(x => Model.StartDate)
                @Html.HiddenFor(x => Model.EndDate)
                @Html.HiddenFor(x => Model.GuestsCount)
                @Html.HiddenFor(x => Model.HotelId)
                @Html.HiddenFor(x => Model.HotelName)
                
                @for (var i = 0; i < Model.Rooms.Count; i++ )
                {
                    @Html.HiddenFor(x => Model.Rooms[i].BedCount)
                    @Html.HiddenFor(x => Model.Rooms[i].Price)
                    @Html.HiddenFor(x => Model.Rooms[i].Reserved)
                    @Html.HiddenFor(x => Model.Rooms[i].RoomId)
                    @Html.HiddenFor(x => Model.Rooms[i].RoomName)
                    @Html.HiddenFor(x => Model.Rooms[i].RoomTypeId)
                    @Html.HiddenFor(x => Model.Rooms[i].SelectedBedCount)
                    if (@Model.Rooms[i].Reserved)
                    {
                        <tr>
                            <td><strong>@Model.Rooms[i].RoomName</strong></td>
                            <td>
                                @if (@Model.Rooms[i].SelectedBedCount == -1)
                                {
                                    @Model.Rooms[i].BedCount
                                }
                                else
                                {
                                    @Model.Rooms[i].SelectedBedCount
                                }
                            </td>
                            <td><strong>@Model.Rooms[i].Price</strong></td>
                        </tr> 
                    }
                }
                </table>
        
                <input id="btn_calc" class="button small success" type="button" value="Calculate price" onclick="calculate();" />
                <p id="total_price" style="display: none; font-size: 24px">
                    Total: <span id="grandTotal">$0</span>
                </p>
                <input id="submit_form" class="button small radius" type="submit" value="Book it!" style="display: none;" />
                @Html.ActionLink("Back", "Details", new { id = Model.HotelId, date = String.Format("{0:MM-dd-yyyy}", Model.StartDate.AddDays(-1)) }, 
                        new { @class = "button small radius" , @id = "back", @style = "display: none;"})
            }
    </div>
</div>
</div>

@section scripts{
    @Scripts.Render("~/bundles/jqueryui")
    <script type="text/javascript">

        $(function () {
            if (document.getElementById("errorMessage") != null &&
                document.getElementById("errorMessage").innerText == "Successful booking!") {
                $('#btn_calc').hide();
            }
        });

        Date.daysBetween = function (date1_ms, date2_ms) {
            //Get 1 day in milliseconds
            var one_day = 1000 * 60 * 60 * 24;
    
            // Calculate the difference in milliseconds
            var difference_ms = date2_ms - date1_ms;
    
            // Convert back to days and return
            return Math.round(difference_ms / one_day);
        }

        function calculate() {
            // Hide total price and submit button
            $('#total_price').hide();
            $('#submit_form').hide();
            $('#back').hide();
    
            // Get prices
            var roomIds = [
            @foreach (var room in Model.Rooms)
            {
                if (room.Reserved == true)
                {
                    @room.RoomId<text>,</text>
                }
            }];
            var roomPrices = [
            @foreach (var room in Model.Rooms)
            {
                if (room.Reserved == true)
                {
                    @room.Price<text>,</text>
                }
            }];
            var selectedBeds = [
            @foreach (var room in Model.Rooms)
            {
                if (room.Reserved == true)
                {
                    @room.SelectedBedCount<text>,</text>
                }
            }];
        
            // Get Dates
            var startDateMs = Date.parse(document.getElementById("startdate").value);
            var endDateMs = Date.parse(document.getElementById("enddate").value);
        
            if (endDateMs <= startDateMs) {
                alert('Booking end date must be after booking start date!')
                return;
            }
        
            // Get days between the two dates
            var totalDays = Date.daysBetween(startDateMs, endDateMs);
        
            // Get the price of room
            var totalPrice = 0;
            for (var i = 0; i < roomIds.length; i++) {

                if (selectedBeds[i] == -1) {
                    totalPrice += totalDays * roomPrices[i];
                }
                else {
                    totalPrice += totalDays * roomPrices[i] * selectedBeds[i];
                }
            }

            if (isNaN(totalPrice))
                totalPrice = 0;
            $('#grandTotal').text('$' + totalPrice);
            $('#total_price').show();
            $('#submit_form').show();
            $('#back').show();
        }
    </script>
}